<template>
  <j-modal
    :title="title"
    :width="width"
    :visible="visible"
    switchFullscreen
    @ok="handleOk"
    :okButtonProps="{ class:{'jee-hidden': disableSubmit} }"
    @cancel="handleCancel"
    cancelText="关闭">
    <a-spin :spinning="confirmLoading">
      <j-form-container :disabled="false">
        <a-form :form="form" slot="detail">
          <a-row>
            <a-col :span="24">
              <a-form-item label="欢迎文字" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <a-input v-decorator="['welcomeText',{rules: [{ required: true, message: '请输入欢迎文字'}]}]" placeholder="请输入欢迎文字"></a-input>
              </a-form-item>
            </a-col>

            <a-col :span="24">
              <a-form-item label="首页背景图片" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <j-image-upload  class="avatar-uploader" text="首页背景图片"
                                 v-decorator="['backgroundUrl',{rules: [{ required: true, message: '首页背景图片'}]}]"></j-image-upload>
              </a-form-item>
            </a-col>

            <a-col :span="24">
              <a-form-item label="商城首页图片" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <j-image-upload  class="avatar-uploader" text="商城首页图片"
                                 v-decorator="['shoppingMallUrl',{rules: [{ required: true, message: '商城首页图片'}]}]"></j-image-upload>
              </a-form-item>
            </a-col>
            <a-col :span="24">
              <a-form-item label="商城系统名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <a-input v-decorator="['webName',{rules: [{ required: true, message: '商城系统名称'}]}]" placeholder="商城系统名称"></a-input>
              </a-form-item>
            </a-col>
            <a-col :span="24">
              <a-form-item label="小程序系统名称" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <a-input v-decorator="['wxName',{rules: [{ required: true, message: '小程序系统名称'}]}]" placeholder="小程序系统名称"></a-input>
              </a-form-item>
            </a-col>
            <a-col :span="24">
              <a-form-item label="LOGO图片" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <j-image-upload  class="avatar-uploader" text="LOGO图片"
                                 v-decorator="['logoUrl',{rules: [{ required: true, message: 'LOGO图片'}]}]"></j-image-upload>
              </a-form-item>
            </a-col>
            <a-col :span="24">
              <a-form-item label="LOGO文字" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <a-input v-decorator="['logoText',{rules: [{ required: true, message: 'LOGO文字'}]}]" placeholder="LOGO文字"></a-input>
              </a-form-item>
            </a-col>
            <a-col :span="24">
              <a-form-item label="加载等待文字" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <a-input v-decorator="['loadingText',{rules: [{ required: true, message: '加载等待文字'}]}]" placeholder="加载等待文字"></a-input>
              </a-form-item>
            </a-col>
            <a-col :span="24">
              <a-form-item label="浏览器顶部图片" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <j-image-upload  class="avatar-uploader" text="浏览器顶部图片"
                                 v-decorator="['browserUrl',{rules: [{ required: true, message: '浏览器顶部图片'}]}]"></j-image-upload>
              </a-form-item>
            </a-col>
            <a-col :span="24">
              <a-form-item label="浏览器顶部文字" :labelCol="labelCol" :wrapperCol="wrapperCol">
                <a-input v-decorator="['browserText',{rules: [{ required: true, message: '浏览器顶部文字'}]}]" placeholder="浏览器顶部文字"></a-input>
              </a-form-item>
            </a-col>
            <!--              <a-col v-if="showFlowSubmitButton" :span="24" style="text-align: center">-->
            <!--                <a-button @click="submitForm">提 交</a-button>-->
            <!--              </a-col>-->
          </a-row>
        </a-form>
      </j-form-container>
    </a-spin>
  </j-modal>
</template>

<script>

import { httpAction, getAction } from '@/api/manage'
import {pick} from 'lodash'
import { validateDuplicateValue } from '@/utils/util'
import JFormContainer from '@/components/cn-form/JFormContainer'
import JDate from '@/components/cn-form/JDate'
import CnDictSelectTag from "@/components/dict/CnDictSelectTag"
import JImageUpload from '@/components/cn-form/JImageUpload'

export default {
  name: "TenantConfig",
  components: {
    JFormContainer,
    JDate,
    CnDictSelectTag,
    JImageUpload
  },
  props: {
  },
  data () {
    return {
      title:'租户配置',
      width:800,
      visible: false,
      disableSubmit: false,
      form: this.$form.createForm(this),
      model: {},
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 },
      },
      confirmLoading: false,
      validatorRules: {
      },
      url: {
        add:  "/sys/manage/updateConfig",
        edit:  "/sys/manage/updateConfig",
        queryById:  "/sys/manage/detail"
      }
    }
  },
  computed: {

  },
  created () {
    // this.showFlowData();
  },
  methods: {
    add () {
      this.visible = true
      this.edit({});
    },
    edit (record) {
      this.visible=true
      this.form.resetFields();
      this.model = Object.assign({}, record);
      this.visible = true;
      this.$nextTick(() => {
        this.form.setFieldsValue(pick(this.model,Object.keys(this.model)))
      })
    },
    close () {

      this.$emit('close');
      this.visible = false;
    },
    handleOk () {
      this.submitForm();
    },
    submitCallback(){
      this.$emit('ok');
      this.visible = false;
    },
    handleCancel () {
      this.close()
    },
    // showFlowData(){
    //   if(this.normal === false){
    //     let params = {id:this.formData.dataId};
    //     getAction(this.url.queryById,params).then((res)=>{
    //       if(res.success){
    //         this.edit (res.result);
    //       }
    //     });
    //   }
    // },
    submitForm () {
      const that = this;
      // 触发表单验证
      this.form.validateFields((err, values) => {
        if (!err) {
          that.confirmLoading = true;
          let httpurl = '';
          let method = '';
          if(!this.model.id){
            httpurl+=this.url.add;
            method = 'post';
          }else{
            httpurl+=this.url.edit;
            method = 'post';
          }
          let formData = Object.assign(this.model, values);
          console.log("表单提交数据",formData)
          httpAction(httpurl,formData,method).then((res)=>{
            if(res.success){
              that.$message.success(res.message);
              that.$emit('ok');
              this.close()
            }else{
              that.$message.warning(res.message);
            }
          }).finally(() => {

            that.confirmLoading = false;
          })
        }

      })
    },
    popupCallback(row){
      this.form.setFieldsValue(pick(row, Object.keys(row)))
    },
  }
}
</script>
